<template>
    <div>
        <el-row type="flex" align="middle">

            <el-col :span="12" class="alignRight">
                <el-row>
                    <span>会员号：</span>

                </el-row>
            </el-col>
            <el-col :span="12" class="alignLeft">
                <el-row>

                    <el-input v-model="vipNum" placeholder="请输入会员号" size="small" class="myInput"></el-input>
                </el-row>
            </el-col>

        </el-row>
        <el-row style="margin-top: 50px;text-align: center">

            <el-button type="primary" class="buttonSize"
                       @click="mySelectVip">确定
            </el-button>

        </el-row>


    </div>
</template>

<script>
    import {mapActions} from 'vuex'

    export default {
        name: "vipInvoicing",
        data() {
            return {
                vipNum: '',

            }
        },
        methods: {
            ...mapActions(['selectVip']),
            openCenter() {
                this.$message({
                    message: '无此会员',
                    center: true
                });
            },
            mySelectVip() {
                let obj = {number: this.vipNum};
                this.selectVip(obj).then(respData=>{
                    console.log(respData);
                    if (respData.code ===200) {
                        this.$router.push('/front/invoicing/invoSelectTableNo')
                    }else{
                        this.openCenter()
                    }
                }).catch(err=>{
                    console.log(err);
                })
            }
        }
    }
</script>

<style lang="less" scoped>
    .alignLeft {
        text-align: left;
    }

    .alignRight {
        text-align: right;
    }

    .myInput {
        width: 150px;
    }

    .buttonSize {
        height: 30px;
        width: 100px;
        padding: 0;
    }
</style>